I'm programming in JQueryMobile, but I can't seem to get some things as I want.

First it's good to tell I am mostly programming in a multi-page template.

I have a login function in the web based app. The idea is that the user sees he's not logged in and the user can click on the button to log in. A dialog box pops up, in which the user can enter his credentials.

This dialog box is in front of the previous page, in my case just index.php. The page for profile is at profile.php#profile. In this case the url for the dialog box is index.php#profile&ui-state=dialog. Don't ask me why, that's how JQueryMobile works, I guess. Anyway, after the user clicks on 'Login' in the pop-up, I want a new dialog to pop-up in which it says you are logged in and I want the content of the page behind it (index.php#profile) to refresh. Of course I want this all to move very smooth and no refreshing of the whole page, to prevent loading time and thus a blank screen for a second.

In short:

• User not logged in
• Clicks on login
• Dialog pops up with form
• Clicks login
• New dialog pops up with 'success' (or whatever) in the same style as the previous dialog
• Clicks ok
• Page behind the dialogues has been refreshed without user noticing

Also another thing that doesn't really work out for me:
I can't seem to get a dialog to pop up, triggered by an action in another dialog. It just appears as a normal page.